import { Tree } from "antd";
import { useState, useCallback, useEffect, useMemo } from "react";
import menus from "@/router/menus";
// const treeData = useMemo(() => first, [second]);
const CustomTree = (props) => {
  const { value, onChange } = props;
  const [checkedKeys, setCheckedKeys] = useState(value);
  const onCheck = useCallback((checkedKeysValue) => {
    setCheckedKeys(checkedKeysValue);
    onChange(checkedKeysValue);
  }, []);
  useEffect(() => {
    setCheckedKeys(value);
  }, [value]);
  return (
    <Tree
      checkable
      autoExpandParent
      fieldNames={{ title: "label" }}
      onCheck={onCheck}
      checkedKeys={checkedKeys}
      treeData={menus}
    />
  );
};
export default CustomTree;
